<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="x-ua-compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"/>
    <title>YouTuTV视频播放</title>
    <link th:href="@{/upload/css/video-js.min.css}" rel="stylesheet">
    <style>
        body {
            background-color: #191919
        }

        .m {
            width: 80%;
            height: 620px;
            margin-left: auto;
            margin-right: auto;
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <div class="m" id="J_prismPlayer" style="text-align: center">
        <video id="my-video" class="video-js" data-setup="{}" th:src="${getPlayUrl}" style="width: 100%;height: 100%" controls="controls"
               controlslist="nodownload">
            <source th:src="${getPlayUrl}" type="video/mp4">
        </video>
        <script th:src="@{/upload/js/video.min.js}"></script>
        <script th:src="@{/upload/js/zh-CN.js}"></script>
        <script type="text/javascript">
            var myPlayer = videojs('my-video');
            videojs("my-video").ready(function () {
                var myPlayer = this;
                myPlayer.play();
            });
        </script>
    </div>
</body>